<html>
<title>class绑定</title>
<script src="../../vue.js"></script>
<style>
	body{
		font-size:24px;
	}
	.active{
		color:red;
	}

</style>
<body>
	<div id="app">
		<div v-bind:class="{active:isActive}">红色文本1</div>
		<div :class="{active:isActive}">红色文本2</div>
		<button @click="btnClick">改变class</button>
	</div>
</body>
<script type="text/javascript">

//实例化vue对象
new Vue({
	el:"#app",
	data:{
		isActive:true,
	},
	methods:{
		btnClick:function(){
			//this.isActive = false;
			this.isActive = !this.isActive; //取反，点击更换颜色
		},
		
	},
	
	
});
</script>
</html>